<template>
    <div class="g-header">
        <div class="hd-left" v-if="navBack" @click="onClose">
            <van-icon name="arrow-left" size="24"/></div>
        <div class="hd-content">
            <slot></slot></div>
        <div class="hd-right">
            <slot name="r-slot"></slot>
        </div>
    </div>
</template>

<script>
  import {reLaunch} from "./index";

  export default {
    name: "m-header",
    props: {
      navBack: {
        default: true
      },
      closeFn: {
        type: Function
      }
    },
    methods: {
      onClose(){
        if (this.closeFn){
          this.closeFn();
          return
        }
        //没有上一页，返回首页
        if (window.history.length <= 1){
          const indexPage = process.env.NODE_ENV === 'development' ? process.env.VUE_APP_INDEX : window.webConfig.webIndexPage
          this.$router.push(indexPage)
        }else {
          this.$router.go(-1);
        }
        // this.$emit('close');
      }
    }
  }
</script>

<style scoped lang="less">
    .g-header{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100vw;
        position: relative;
        font-size: 18px;
        height: 44px;
        background: #fff;
        .hd-left{
            position: absolute;
            width: 50px;
            height: 100%;
            left: 0;
            display: flex;
            align-items: center;
            justify-content: left;
            padding-left: 10px;
        }
        .hd-right{
            position: absolute;
            right: 0;
            height: 100%;
            display: flex;
            align-items: center;
        }
    }
</style>
